<%@page import="com.qdu.entity.Activity"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page import="java.util.List"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>公益活动</title>

        <link href="css/bootstrap.min.css" rel="stylesheet" />
        <link href="css/flexslider.css" rel="stylesheet" />
        <link href="css/style.css" rel="stylesheet" />
        <link href="css/style_1.css" rel="stylesheet" />
        <link rel="stylesheet" href="css/font-awesome.min.css">
        <script src="js/jquery.flexslider.js"></script>
        
        <link href="css/bootstrap.min.js" rel="stylesheet" />
        <script src="js/jquery.min.js"></script>

        <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
        <link href='http://fonts.useso.com/css?family=Source+Sans+Pro:200,300,400,600,700,900' rel='stylesheet' type='text/css'>
     
    </head>

    <body>
        <div class="header">
            <div class="container">
                <a class="navbar-brand" href="index"><i class="fa fa-home"></i>Home</a>

                <div class="text-center">
                    <!--搜索页面-->
                    <form action="gnms" class="form-inline">
                        <input type="text" id="input_wd" name="keyword" class="form-control keyword_text" placeholder="输入活动名称">
                        <button type="submit" class="btn banner_btn keyword_text1">搜索</button>
                    </form>

                </div>

                <div class="menu"> <a class="toggleMenu" href="#"><img src="images/nav_icon.png" alt="" /> </a>
                    <ul class="nav" id="nav">
                        <li class=""><a href="salfm">日志</a></li>
                        <li><a href="allActivity">活动</a></li>
                        <li><a href="profile">个人页面</a></li>
                        <li><a href="wrmps">管理员登录</a></li>

                    </ul>
                    <script type="text/javascript" src="js/responsive-nav.js"></script> 
                </div>
            </div>
        </div>

        <%
            List<Activity> list=(List<Activity>)request.getAttribute("allActivity_list");
            pageContext.setAttribute("list",list);
        %>
        
        
        <!--轮播页面-->
        <div class="banner text-center">
            <div class="">


                <div id="carousel-example-generic" style="width:100%;" class="carousel slide" data-ride="carousel">
                    <!-- Indicators -->
                    <ol class="carousel-indicators">
                        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                        <li data-target="#carousel-example-generic" data-slide-to="3"></li>
                    </ol>

                    <!-- Wrapper for slides -->
                    <div class="carousel-inner" role="listbox">
                        <c:forEach items="${requestScope.allActivity_list}" var="l" begin="0" end="0">
                        <div class="item active">
                            <img src="images/bg1.jpg" alt="...">
                            <div class="carousel-caption">
                                推荐活动一--${l.aname}：${l.atype}
                                <%--<%= // list.get(0).getAtype()%>--%>
                                <br>
                                <a class="banner_btn" href="gmis?activityId=${l.activityId}">了解更多>></a> 
                            </div>
                        </div>
                        </c:forEach>
                        <c:forEach items="${requestScope.allActivity_list}" var="l" begin="1" end="1">
                        <div class="item">
                            <img src="images/bg2.jpg" alt="...">
                            <div class="carousel-caption">
                                推荐活动二--${l.aname}：${l.atype}
                                <br>
                                <a class="banner_btn" href="gmis?activityId=${l.activityId}">了解更多>></a>
                            </div>
                        </div>
                        </c:forEach>
                        <c:forEach items="${requestScope.allActivity_list}" var="l" begin="2" end="2">
                        <div class="item">
                            <img src="images/bg3.jpg" alt="...">
                            <div class="carousel-caption">
                                推荐活动三--${l.aname}：${l.atype}
                                <br>
                                <a class="banner_btn" href="gmis?activityId=${l.activityId}">了解更多>></a>
                            </div>
                        </div>
                        </c:forEach>
                        <c:forEach items="${requestScope.allActivity_list}" var="l" begin="3" end="3">
                        <div class="item">
                            <img src="images/bg4.jpg" alt="...">
                            <div class="carousel-caption">
                                推荐活动四--${l.aname}：${l.atype}
                                <br>
                                <a class="banner_btn" href="gmis?activityId=${l.activityId}">了解更多>></a>
                            </div>
                        </div>
                        </c:forEach>
                    </div>

                    <!-- Controls -->
                    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                        <span class="sr-only">Next</span>
                    </a>
                </div>



            </div>
        </div>

        <div class="main">
            <div class="content_white">
                <h2>推荐活动</h2>
                <p>下面都是通过审核的优质活动，快来挑选一下吧！</p>
            </div>
            <div class="featured_content" id="feature">
                <div class="container">
                    <div class="row text-center">
                        <div class="col-mg-3 col-xs-3 feature_grid1"> <i class="fa fa-github-alt fa-3x"></i>
                            <h3 class="m_1"><a href="gmis?activityId=${list.get(0).activityId}">${list.get(0).aname}</a></h3>
                            <p class="m_2">简介：${list.get(0).atype}<br>
                            志愿者等级要求：${list.get(0).arank}<br>
                            开始时间：${list.get(0).astartTime}<br>
                            所需人数：${list.get(0).anumber}<br>
                            状态：${list.get(0).astatus}</p>
                            <a href="gmis?activityId=${list.get(0).activityId}" class="feature_btn">More</a> 
                        </div>


                        <div class="col-mg-3 col-xs-3 feature_grid1"> <i class="fa fa-bicycle fa-3x"></i>
                            <h3 class="m_1"><a href="gmis?activityId=${list.get(1).activityId}">${list.get(1).aname}</a></h3>
                            <p class="m_2">简介：${list.get(1).atype}<br>
                            志愿者等级要求：${list.get(1).arank}<br>
                            开始时间：${list.get(1).astartTime}<br>
                            所需人数：${list.get(1).anumber}<br>
                            状态：${list.get(1).astatus}</p>
                            <a href="gmis?activityId=${list.get(1).activityId}" class="feature_btn">More</a> </div>


                        <div class="col-md-3 col-xs-3 feature_grid1"> <i class="fa fa-wheelchair fa-3x"></i>
                            <h3 class="m_1"><a href="services.html">${list.get(2).aname}</a></h3>
                            <p class="m_2">简介：${list.get(2).atype}<br>
                            志愿者等级要求：${list.get(2).arank}<br>
                            开始时间：${list.get(2).astartTime}<br>
                            所需人数：${list.get(2).anumber}<br>
                            状态：${list.get(2).astatus}</p>
                            <a href="gmis?activityId=${list.get(2).activityId}" class="feature_btn">More</a> </div>


                        <div class="col-md-3 col-xs-3 feature_grid2"> <i class="fa fa-globe fa-3x"></i>
                            <h3 class="m_1"><a href="gmis?activityId=${list.get(3).activityId}">${list.get(3).aname}</a></h3>
                            <p class="m_2">简介：${list.get(3).atype}<br>
                            志愿者等级要求：${list.get(3).arank}<br>
                            开始时间：${list.get(3).astartTime}<br>
                            所需人数：${list.get(3).anumber}<br>
                            状态：${list.get(3).astatus}</p>
                            <a href="gmis?activityId=${list.get(3).activityId}" class="feature_btn">More</a> </div>
                    </div>
                </div>
            </div>
            
            <div class="about-info">
                <div class="container">
                    <div class="row">
                        <div class="col-md-8">
                            <div class="block-heading-two">
                                <h2><span>关于我们</span></h2>
                            </div>
                            <p>
                                &nbsp;&nbsp;&nbsp;&nbsp;公益活动是从长远着手，出人、出物或出钱赞助和支持某项社会公益事业的公共关系实务活动。公益活动的宣传是目前社会组织特别是一些经济效益比较好的企业，用来扩大影响，提高美誉度的重要手段
                                
                            </p>
                            <br>
                            <br>
                            <p>
                                &nbsp;&nbsp;&nbsp;&nbsp;公益活动几乎都是由单位，学校等各个场所组织的，义务植树，义务大扫除，爱心满世界志愿者，献血，捐款/捐物、爱心助学（王安迟）、关爱失独（狐视眈眈）是很常见的公益活动社会公益事业是中国优良传统的延续，是构建社会主义和谐社会的内在要求。
                            </p>
                            <a class="banner_btn" href="about.html">了解更多</a> </div>


                        <div class="col-md-4">
                            <div class="block-heading-two">
                                <h3><span>小贴士</span></h3>
                            </div>
                            <div class="panel-group" id="accordion-alt3">
                                <div class="panel">
                                    <div class="panel-heading">
                                        <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion-alt3" href="#collapseOne-alt3"> <i class="fa fa-angle-right"></i> 用户等级</a> </h4>
                                    </div>
                                    <div id="collapseOne-alt3" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <p>&nbsp;&nbsp;用户级别分为一级，二级，三级。注册即为一级用户，当在本平台参与的活动达到一定数量，就可以升级等级。<br>&nbsp;&nbsp;
                                                三级用户可以发布公益任务。有些公益活动有用户级别限制，用户等级越高意味着可以挑选更多更优秀的公益活动，努力升级吧！</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="panel">
                                    <div class="panel-heading">

                                        <h4 class="panel-title"> 
                                            <a data-toggle="collapse" data-parent="#accordion-alt3" href="#collapseTwo-alt3"> 
                                                <i class="fa fa-angle-right"></i> 关于日志
                                            </a>
                                        </h4>

                                    </div>
                                    <div id="collapseTwo-alt3" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <p>&nbsp;&nbsp;&nbsp;&nbsp;忙碌了一天，对这个公益活动是否有更多的体会和感慨？编写一篇日志记录下来吧，写日志可以增加用户经验值，有助于提高用户等级，当被选入精选日志，得到的经验值更多哦。</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="panel">
                                    <div class="panel-heading">

                                        <h4 class="panel-title">
                                            <a data-toggle="collapse" data-parent="#accordion-alt3" href="#collapseThree-alt3">
                                                <i class="fa fa-angle-right"></i> 活动
                                            </a> 
                                        </h4>

                                    </div>
                                    <div id="collapseThree-alt3" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <p>&nbsp;&nbsp;&nbsp;&nbsp;假如你是三级用户，可以直接发布任务。不是三级用户也不要紧，把活动详情发到管理员邮箱，管理员就可以帮你发布任务了。</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="panel">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">
                                            <a data-toggle="collapse" data-parent="#accordion-alt3" href="#collapseFour-alt3"> 
                                                <i class="fa fa-angle-right"></i> 活动报名
                                            </a> 
                                        </h4>
                                    </div>
                                    <div id="collapseFour-alt3" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <p>&nbsp;&nbsp;&nbsp;&nbsp;在活动页面点击报名按钮，举办者审核后，会收到一个邮件，告知是否通过，和活动举办方的电话信息，通过后即可参与活动。</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


            <div class="testimonial-area">
                <div class="testimonial-solid">
                    <div class="container">
                        <h2>精彩日志</h2>
                        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                            <ol class="carousel-indicators">
                                <c:forEach items="${requestScope.logList}" var="l" begin="0" end="3">
                                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"> <a href="solfm?logId=${l.id}"></a> </li>
                                </c:forEach>
                            </ol>
                            <div class="carousel-inner">
                                <c:forEach items="${requestScope.logList}" var="l" begin="0" end="0">
                                <div class="active item" style="background-image: url(images/${l.imag});background-size: 100% 100%;background-repeat:no-repeat;width:1200px">
                                    <a href="solfm?logId=${l.getId()}" style="text-decoration: none">
                                    <p>${l.getName()}</p>
                                    </a>
                                    <p><strong>- ${l.getUserid()} -</strong></p>
                                    
                                </div>
                                </c:forEach>
                                <c:forEach items="${requestScope.logList}" var="l" begin="1" end="1">
                                <div class="item"  style="background-image: url(images/${l.imag});background-size: 100% 100%;background-repeat:no-repeat;width:1200px">
                                    <a href="solfm?logId=${l.getId()}" style="text-decoration: none">
                                    <p>${l.getName()}</p>
                                    </a>
                                    <p><strong>- ${l.getUserid()} -</strong></p>
                                    
                                </div>
                                </c:forEach>
                                <c:forEach items="${requestScope.logList}" var="l" begin="2" end="2">
                                <div class="item"  style="background-image: url(images/${l.imag});background-size: 100% 100%;background-repeat:no-repeat;width:1200px">
                                    <a href="solfm?logId=${l.getId()}" style="text-decoration: none">
                                    <p>${l.getName()}</p>
                                    </a>
                                    <p><strong>- ${l.getUserid()} -</strong></p>
                                    
                                </div>
                                </c:forEach>
                            </div>
                        </div>
                     
                    </div>
                </div>
            </div>

            <div class="footer">
                <div class="footer_bottom">
                    <div class="follow-us"> <a class="fa fa-facebook social-icon" href="#"></a> <a class="fa fa-twitter social-icon" href="#"></a> <a class="fa fa-linkedin social-icon" href="#"></a> <a class="fa fa-google-plus social-icon" href="#"></a> </div>
                    <div class="copy">
                        <p>制作人@软件外包BD03班平平无奇天才队 <a href="#" target="_blank" title="联系我们">联系我们</a> 
                    </div>
                </div>
            </div>
            <script src="js/bootstrap.min.js"></script> 
            <script src="js/jquery.flexslider.js"></script>
        </div>
    </body>
    
</html>
